<template>
  <a-form-model ref="putInModalForm" :model="putInModalForm" :label-col="{ span: 6 }" :wrapper-col="{ span: 16 }">
    <a-form-model-item label="站点" prop="locationId" :rules="[{ required: true, message: '请选择站点', trigger: 'blur' }]">
      <a-select show-search :allowClear="true" placeholder="请选择站点" v-model="putInModalForm.locationId" @change="" :filter-option="filterOption">
        <a-spin v-if="userLoading" slot="notFoundContent" size="small" />
        <a-select-option v-for="(item, index) in allLocation" :key="index" :value="item.userId">{{ item.userName }}</a-select-option>
      </a-select>
    </a-form-model-item>
    <a-form-model-item label="产品" prop="productId" :rules="[{ required: true, message: '请选择产品', trigger: 'blur' }]">
      <a-select show-search :allowClear="true" placeholder="请选择产品" v-model="putInModalForm.productId" @change="" :filter-option="filterOption">
        <a-spin v-if="userLoading" slot="notFoundContent" size="small" />
        <a-select-option v-for="(item, index) in allLocation" :key="index" :value="item.userId">{{ item.userName }}</a-select-option>
      </a-select>
    </a-form-model-item>
    <a-form-model-item label="套餐" prop="productItemId" :rules="[{ required: true, message: '请选择套餐', trigger: 'blur' }]">
      <a-select show-search :allowClear="true" placeholder="请选择套餐" v-model="putInModalForm.productItemId" @change="" :filter-option="filterOption">
        <a-spin v-if="userLoading" slot="notFoundContent" size="small" />
        <a-select-option v-for="(item, index) in allLocation" :key="index" :value="item.userId">{{ item.userName }}</a-select-option>
      </a-select>
    </a-form-model-item>
    <a-form-model-item label="视频链接" prop="videoUrl" :rules="[{ required: true, message: '请输入视频链接', trigger: 'blur' }]">
      <a-input v-model="putInModalForm.videoUrl" :maxLength="20" placeholder="请输入视频链接"></a-input>
    </a-form-model-item>
    <a-form-model-item label="主播抖音号" prop="dyNo" :rules="[{ required: true, message: '请输入主播抖音号', trigger: 'blur' }]">
      <a-input v-model="putInModalForm.dyNo" :maxLength="20" placeholder="请输入主播抖音号"></a-input>
    </a-form-model-item>
    <a-form-model-item
      label="投放金额"
      prop="money"
      :rules="[
        { required: true, trigger: 'blur', message: '请输入投放金额' },
        {
          pattern: /^\d+(\.\d+)?$/,
          message: '金额格式有误',
          trigger: 'blur'
        }
      ]"
    >
      <a-input v-model="putInModalForm.money" placeholder="请输入投放金额" :maxLength="10"></a-input>
    </a-form-model-item>
    <a-form-model-item label="投放时间" prop="agentShopInfoDataList2" :rules="[{ required: true, message: '请选择投放时间', trigger: 'blur' }]">
      <a-range-picker @change="changeTime" v-model="putInModalForm.putTime" />
    </a-form-model-item>
  </a-form-model>
</template>
<script>
const g = function(item = {}) {
  return {
    douApplyId: item.accountName || 0,
    dyNo: item.agentName || '',
    id: item.id || 0,
    location: item.location || '',
    locationId: item.locationId || '',
    money: item.money || '',
    productId: item.productId || '',
    productItemId: item.productItemId || '',
    productItemName: item.productItemName || '',
    productName: item.productName || '',
    putTime: item.putTime && item.putTime.length > 0 ? item.putTime : []
  }
}

export default {
  name: 'putInForm',
  props: {
    dataObject: {
      type: Object,
      default: () => {}
    }
  },
  watch: {},
  data() {
    return {
      putInModalForm: g(),
      allLocation: [],
      userLoading: false
    }
  },
  methods: {
    filterOption(input, option) {
      return option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
    },
    changeTime(e) {
      console.log(e)
    }
  }
}
</script>
